<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Demo</title>
  <link href="https://web.sdk.qcloud.com/player/tcplayer/release/v4.9.0/tcplayer.min.css" rel="stylesheet" />

</head>

<body>
  <!-- 设置播放器容器 -->
  <video id="player-container-id" preload="auto" width="640" height="360" playsinline webkit-playsinline
    x5-playsinline></video>
  <div id="app"></div>
  <script type="module" src="/src/main.js"></script>
</body>

</html>

<!-- 播放器脚本文件 -->
<script src="https://vod-tool.vod-qcloud.com/dist/static/js/tcplayer.v4.9.1.min.js"></script>
<script>
  var player = TCPlayer("player-container-id", { // player-container-id 为播放器容器ID，必须与html中一致
    fileID: "1253642699703384907", // 请传入需要播放的视频fileID 必须
    appID: "1305089639", // 请传入点播账号的子应用appID 必须
    psign: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhcHBJZCI6MTMwNTA4OTYzOSwiZmlsZUlkIjoiMTI1MzY0MjY5OTcwMzM4NDkwNyIsImN1cnJlbnRUaW1lU3RhbXAiOjE3MjAxNjgwMDAsImNvbnRlbnRJbmZvIjp7ImF1ZGlvVmlkZW9UeXBlIjoiVHJhbnNjb2RlIiwidHJhbnNjb2RlRGVmaW5pdGlvbiI6MTAwODEwfSwidXJsQWNjZXNzSW5mbyI6eyJ1cyI6InRlc3QiLCJkb21haW4iOiIxMzA1MDg5NjM5LnZvZC1xY2xvdWQuY29tIiwic2NoZW1lIjoiSFRUUFMifX0.7M585OcjvBJtpZSFgkuNJjs7plunmZy7Vam5ATB5Fa4", // 请传入播放器签名psign 必须
    autoplay: false, // 是否自动播放
    plugins: {
      ProgressMarker: true,
      ContextMenu: {
        statistic: true
      }
    }
    // 其他参数请在开发文档中查看
  });
</script>